<template>
  <div class="adjust-lifespan-form">
    <a-form v-if="record" layout="vertical">
      <a-form-item label="调整原因">
        <a-select v-model:value="form.reason" placeholder="选择调整原因">
          <a-select-option value="业力变化">业力变化</a-select-option>
          <a-select-option value="特殊事件">特殊事件</a-select-option>
          <a-select-option value="天命修正">天命修正</a-select-option>
        </a-select>
      </a-form-item>

      <a-form-item label="调整数值">
        <a-input-number v-model:value="form.adjustment" :min="-50" :max="50" />
        <span class="adjustment-desc">正数为增加，负数为减少</span>
      </a-form-item>

      <a-form-item>
        <a-space>
          <a-button type="primary" @click="handleSubmit">确认调整</a-button>
          <a-button @click="$emit('cancel')">取消</a-button>
        </a-space>
      </a-form-item>
    </a-form>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { message } from 'ant-design-vue'

const props = defineProps({
  record: Object
})

const emit = defineEmits(['success', 'cancel'])

const form = ref({
  reason: '',
  adjustment: 0
})

const handleSubmit = () => {
  if (!form.value.reason) {
    message.warning('请选择调整原因')
    return
  }

  emit('success')
  message.success('寿命调整成功')
}
</script>

<style lang="scss" scoped>
.adjust-lifespan-form {
  padding: 16px;

  .adjustment-desc {
    margin-left: 8px;
    color: #666;
    font-size: 12px;
  }
}
</style>
